<template>
  <div class="portalPage">
    <parser :portalConfData="portalConfData" page="portalPage"></parser>
  </div>
</template>
<script>
import { getPortalInfo } from "@/api/custom/portalDesigner";
import parser from "./parser";
export default {
  components: {
    parser,
  },
  data() {
    return {
      portalConfData: [], //门户页面配置
    };
  },
  mounted() {
    this.getFormDetail(); //获取门户详情
  },
  beforeRouteLeave(to, from, next) {
    this.$store.commit("CHANGE_FLAG", false);
    next();
  },
  methods: {
    //获取门户详情
    getFormDetail() {
      let path = this.$route.path.split("/");
      getPortalInfo({
        id: path[path.length - 1],
      })
        .then((res) => {
          if (res.code === 0) {
            this.portalConfData = JSON.parse(res.data.portalJsonMessage);
            const pageWidth = document.getElementsByClassName("portalPage")[0].scrollWidth;
            this.portalConfData.forEach((comp) => {
              comp.width = pageWidth * comp.parcentWidth;
            });
            this.$store.commit("CHANGE_FLAG", true);
          }
        })
        .catch((e) => console.log(e));
    },
  },
};
</script>
<style lang="scss" scoped>
.portalPage {
  width: 100%;
  height: calc(100vh - 84px);
  overflow-y: auto;
  overflow-x: hidden;
  position: absolute;
}
</style>
